#study {
    background: #FAFAFA;
    .header {
        background: white;
        padding: .2rem .32rem;
        border-bottom: 1px solid #FAFAFA;
        display: flex;
        align-items: center;
        .header_label{
            font-size: .44rem;
            line-height: .64rem;
            color: #333333;
            
        }
        .header_left {
            margin:0 .32rem;
            flex: 1;
            position: relative;
            z-index: 8;
            img {
                width: .33rem;
                height: .33rem;
                position: absolute;
                z-index: 9;
                left: .2rem;
                top: 0;
                bottom: 0;
                margin: auto;
            }
            .input_btn{
                display: flex;
                align-items: center;
                width: 100%;
                border-radius: 1rem;
                background: #F7F7F7;
                border: none;
                height: .64rem;
                font-size: .3rem;
                color: #999999;
                padding-left: .62rem;
            }
            input {
                width: 100%;
                border-radius: 1rem;
                background: #F7F7F7;
                border: none;
                height: .64rem;
                font-size: .3rem;
                line-height: .4rem;
                color: #333333;
                padding-left: .62rem;
            }
        }
        .header_right {
            position: relative;
            z-index: 8;
            i {
                display: block;
                width: .2rem;
                height: .2rem;
                border-radius: 50%;
                background: #FF3B30;
                position: absolute;
                right: -0.05rem;
                top: -.02rem;
            }
            img {
                width: .5rem;
                height: .5rem;
            }
        }
    }
    .content {
        background: white;
        margin-bottom: 1rem;
        .img_nav {
            display: flex;
            justify-content: space-between;
            padding: .32rem .32rem .48rem .32rem;
            border-bottom: .2rem solid #FAFAFC;
            .nav_f{
                position: relative;
                z-index: 8;
                .nav_label{
                    position: absolute;
                    left: .14rem;
                    top: .14rem;
                    color: white;
                    font-size: .28rem;
                    line-height: .4rem;
                    z-index: 9;
                }
            }
            img {
                border-radius: .1rem;
                width: 3.3rem;
                height: 1.32rem;
                margin-right: .25rem;
                &:last-child {
                    margin-right: 0;
                }
            }
        }
        .class_nav {
            border-bottom: .2rem solid #FAFAFA;
            padding: 0 .29rem .24rem .29rem;
            display: flex;
            flex-wrap: wrap;
            .nav_item {
                font-size: .26rem;
                color: #333333;
                margin: 0 .198rem .24rem 0;
                width: 1.58rem;
                height: .6rem;
                display: flex;
                align-items: center;
                justify-content: center;
                background: #F0F0F0;
                color: #333333;
                border-radius: .3rem;
                &:nth-child(4n) {
                    margin-right: 0;
                }
            }
        }
        .live_title {
            display: flex;
            align-items: center;
            height: 1.2rem;
            padding: 0 .32rem;
            justify-content: space-between;
            color: #333333;
            font-size: .34rem;
            font-weight: 700;
            border-bottom: 1px solid #FAFAFA;
            .live_right {
                font-weight: 500;
                font-size: .28rem;
                color: #999999;
                display: flex;
                align-items: center;
                img{
                    width: .3rem;
                    height: .3rem;
                    margin-right: .08rem;
                }
                span{
                    color: #DCBBC9;
                    font-size: .28rem;
                }
            }
        }
        .live_list {
            .yd-list-donetip{
                background: white;
            }
            padding: .64rem .32rem 0 .32rem;
            .list {
                margin: 0 .02rem .64rem .02rem;
                padding: .32rem;
                border-radius: .1rem;
                box-shadow: 0px .04rem .2rem 0px rgba(0, 0, 0, 0.08);
                .list_header {
                    display: flex;
                    margin-bottom: .32rem;
                    align-items: center;
                    .list_header_top {
                        padding: 1px;
                        overflow: hidden;
                        flex: 1;
                        display: flex;
                        align-items: center;
                        .list_header_top_img {
                            border-radius: 50%;
                            width: .72rem;
                            height: .72rem;
                            margin: 1px .16rem 1px 1px;
                        }
                        span {
                            line-height: inherit;
                            flex: 1;
                            padding-right: .2rem;
                            color: #333333;
                            font-weight: 500;
                        }
                    }
                    //这种垂直居中的在安卓一直有问题，日他大爷的，
                    .list_header_bottom {
                        //                  height: .5rem;
                        width: 1.6rem;
                        padding: .06rem 0;
//                      background: linear-gradient(135deg, rgba(255, 129, 39, 1) 0%, rgba(254, 67, 135, 1) 100%);
                        background: #DCBBC9;
                        border-radius: 1rem;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        .list_header_bottom_img {
                            width: .25rem;
                            height: .25rem;
                            margin-right: .085rem;
                        }
                        span {
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            color: white;
                            font-size: .26rem;
                            //                      line-height: .37rem;//这里用这个安卓机出问题，所以用下面的定死高度
                            height: .37rem;
                        }
                    }
                }
                .list_title {
                    overflow: hidden;
                    font-size: .32rem;
                    margin: 0 0 .16rem 0;
                }
                .list_bottom {
                    color: #999999;
                    font-size: .28rem;
                    line-height: .4rem;
                    .list_bottom_password {
                        display: flex;
                        span {
                            flex: 1;
                            padding-right: .2rem;
                        }
                        .password_paly {
                            font-size: .28rem;
                            line-height: .4rem;
                        }
                    }
                }
            }
        }
    }
    .pop_nike_name{
        width: 5.4rem;
        border-radius: .24rem;
        background: white;
        .title{
            font-weight: 700;
            padding: .3rem 0 .2rem 0;
            text-align: center;
        }
        .label{
            font-size: .28rem;
            line-height: .4rem;
            color: #A1A1A1;
            margin-bottom: .42rem;
            text-align: center;
        }
        .pop_nike_name_input{
            width: 4.74rem;
            border-radius:.08rem;
            border:1px solid rgba(230,230,230,1);
            margin:  0 auto .4rem ;
            input{
                text-align: center;
                width: 100%;
                border: none;
                height: .7rem;
                font-size: .26rem;
                line-height: .37rem;
                padding: 0 .16rem;
            }
        }
        ul{
            border-top: 1px solid #E6E6E6;
            display: flex;
            font-weight: 500;
            li{
                color: #999999;
                padding: .2rem 0 .16rem 0;
                width: 50%;
                text-align: center;
                border-right: 1px solid #E6E6E6;
                &:last-child{
                    border-right: none;
                    color: #DCBBC9;
                }
            }
        }
    }
}